{% extends "base.html" %}

{% block title %} {{ topic.title }} {% endblock %}

{% block content %}

<div style="float: right; width: 25%"> &nbsp; </div>
<div style="float: right; width: 50%; text-align: center;">
    <h2> {{ topic.title }} </h2>
</div>
<div style="float: left; width: 25%">

{% if creating_user_or_admin %}
    <table align="left">
    <tr>
    <td>
        <form method="post" action="/topics/add_edit">
            <input name="topic_id" type="hidden" value="{{ topic.topic_id }}" />
            <input class="btn" name="edit" type="submit" value="عدل الموضوع" >
        </form>
    </td>
    <td>
    <form method="post">
        <input name="topic_id" type="hidden" value="{{ topic.topic_id }}" />
        <input class="btn" name="delete" type="submit" value="احذف الموضوع" onclick="return confirm('هل أنت متأكد من رغبتك حذف الموضوع؟')">
    </form>
    </td>
    </tr>
    </table>
{% endif %}
</div>

<div class="row-fluid quran_font">

		<div class="row-fluid">
			<div>
{% for line in lines %}
    {% if line.new_section %}
    		</div>
    	</div>
    	<div class="row-fluid">
            <div class="span2">
	            <a href="/display_sura/{{ line.sura_number }}"
	            	class="sura_link quran_text topic_sura"> 
	                {{ line.sura_number }}.{{ line.sura_name }} 
	            </a>
            </div>
            <div class="span8 quran_section quran_text topic_ayat">
    {% endif %}
        		{{ line.aya_content }}
        		<a href="/display_sura/{{ line.sura_number }}#{{ line.aya_number }}" class="sura_link">﴿{{ line.aya_number }}﴾</a>
{% endfor %}
	</div>
</div>

{% endblock %}